<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://xmlns.jcp.org/jsf/core">
    <h:head>
        <title>Show Events</title>
    </h:head>
    <h:body> 
        <div align="center">
                    <h:form id="button">
                        <br></br>
                        <p:commandButton id="viewPersonal" value="Personal Page" action="#{searchUserBean.uploadPersonalPage()}" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">  
                        </p:commandButton><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer>
                        <p:commandButton id="newEvent" value="New Event" action="new-event" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton><p:spacer></p:spacer><p:spacer></p:spacer>
                        <p:commandButton id="searchUser" value="Browse User" action="#{searchBean.browseUsers()}" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer>
                        <p:commandButton id="searchEvent" value="Search Event" action="search-event-page" ajax="true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">  
                        </p:commandButton><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer>
                        <p:commandButton id="logout" value="Logout" action="#{loginBean.logout()}" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer>
                        <p:commandButton id="mainPage" value="Main Page" action="main-page?faces-redirect=true" style="width:200px;height:50px;margin-left: 5px;margin-right: 5px">
                        </p:commandButton><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer><p:spacer></p:spacer>
                        </h:form>
                
            </div>
        <br></br><br></br><br></br>
        <div align="center">
                <h:form id="form">
                <p:growl id="growl" autoUpdate="true" showSummary="false" redisplay="false" showDetail="true" sticky="true" />
            <p:calendar id="keywordDate" value="#{showEventBean.keywordDate}" navigator="true" mode="popup" showOn="button" required="true">
            <p:watermark for="keywordDate" value="Chose a day"  />
            </p:calendar><p:spacer></p:spacer>
            <p:commandButton id="searchDate" value="Search an event" action="#{showEventBean.searchEvent()}" update="event_list"/>
             <br></br><br></br><br></br><br></br><br></br>
            <p:dataList id="event_list" value="#{showEventBean.currentEventList}" var="event" style="width: 200px" type="unordered" itemType="none" paginator="true" rows="10" styleClass="paginated">
                <f:facet name="header">
                    Event List
                </f:facet>
                <p:commandLink update=":form:eventDetail" oncomplete="PF('eventDialog').show()" title="View Detail" styleClass="ui-icon ui-icon-search" style="float:left;margin-right:10px">
                    <f:setPropertyActionListener value="#{event}" target="#{showEventBean.selectedEvent}" />
                    <h:outputText value="#{event.name}, #{event.description}" />
                </p:commandLink>
                <h:outputText id="event_review" style="display:inline-block">#{event.name}, #{event.description}</h:outputText>
            <h:outputText value="#{event.name}, #{event.description}" style="display:inline-block"/>
            </p:dataList>

            <p:dialog id="evDtsWindow" header="Event Informations" widgetVar="eventDialog" modal="true" showEffect="blind" resizable="false">
                <p:outputPanel id="eventDetail" style="text-align:center;">
                    <p:panelGrid  columns="2" rendered="#{not empty showEventBean.selectedEvent}" columnClasses="label,value">

                        <h:outputText value="Name:" />
                        <h:outputText value="#{showEventBean.selectedEvent.name}" />

                        <h:outputText value="Starting Date" />
                        <h:outputText value="#{showEventBean.selectedEvent.starting_date}" />

                        <h:outputText value="Starting Time" />
                        <h:outputText value="#{showEventBean.selectedEvent.startingTime.hours}:#{showEventBean.selectedEvent.startingTime.minutes}" />

                        <h:outputText value="Ending Date" />
                        <h:outputText value="#{showEventBean.selectedEvent.ending_date}" />

                        <h:outputText value="Ending Time" />
                        <h:outputText value="#{showEventBean.selectedEvent.endingTime.hours}:#{showEventBean.selectedEvent.endingTime.minutes}" />

                        <h:outputText value="Weather" />
                        <h:outputText value="#{showEventBean.selectedEvent.expectedWeather.name}" />

                        <h:outputText value="Descrption:" />
                        <h:outputText value="#{showEventBean.selectedEvent.description}"/>

                        <h:outputText value="Place" />
                        <h:outputText value="#{showEventBean.selectedEvent.place}" />

                        <h:outputText value="Participants" />
                        <p:dataList id="pending_list" value="#{showEventBean.selectedEvent.pendingUsers}" var="user" itemType="disc" >
                        #{user.username}
                        </p:dataList>

                        <p:commandButton id="deleteEvent" value="Delete" action="#{deleteEventBean.deleteEvent()}">
                            <f:setPropertyActionListener value="#{showEventBean.selectedEvent.idEvent}" target="#{deleteEventBean.idEvent}" />
                        </p:commandButton>
                        <p:commandButton id="modifyEvent" value="Modify" action="modify-event-page?faces-redirect=true">
                        </p:commandButton>
                    </p:panelGrid>
                </p:outputPanel>
            </p:dialog>
            
            </h:form>
            </div>
    </h:body>
</html>
